<% layout('/layouts/_default.html', {title: '', libs: ['zTree'], bodyClass: 'box box-main'}){ %>
<div class="treeShowHideButton" onclick="search();">
  <label id="btnShow" title="显示搜索" style="display:none;">︾</label>
  <label id="btnHide" title="隐藏搜索">︽</label>
</div>
<div class="treeSearchInput" id="search">
  <label for="keyword">关键字：</label><input type="text" class="empty" id="keyword" maxlength="50"/>
  <button class="btn" id="btn" onclick="searchNode()"> 搜索 </button>
</div>
<div class="treeExpandCollapse" style="display:none;">
  <a href="javascript:" onclick="tree.expandAll(true);">展开</a> /
  <a href="javascript:" onclick="tree.expandAll(false);">折叠</a>
</div>
<div id="tree" class="ztree treeselect"></div>
<% } %>
<script>
var setting = {
  view:{selectedMulti:false,dblClickExpand:false},
  check:{enable:"false"=="true",nocheckInherit:true},
  data:{simpleData:{enable:true, pIdKey: '${parameter.pIdKey!'pid'}'}},
  callback:{
    onClick:function(event, treeId, treeNode){
      tree.expandNode(treeNode);
    },
    onDblClick: function(){
      js.layer.$('#' + window.name).closest('.layui-layer')
        .find(".layui-layer-btn0").trigger("click");
    }
  }
}, tree, loadTree = function(){
  $.get("${parameter.url}&t=" + new Date().getTime(), function(zNodes){
    tree = $.fn.zTree.init($("#tree"), setting, zNodes);//.expandAll(true);
    var nodes = tree.getNodesByParam("level", 0);
    for(var i=0, l=nodes.length; i<l; i++) {
      if (nodes[i].children && nodes[i].children.length > 0){
        $('.treeExpandCollapse').show();
        break;
      }
    }
    $.fn.zTree.expandNodeByLevel(tree, -1);
    if (zNodes && zNodes.length > 0){
      var selectCodes = "".split(",");
      selectCheckNode(selectCodes);
    }
  });
};
loadTree();
function selectCheckNode(selectCodes){
  for(var i=0; i<selectCodes.length; i++) {
    var isLoadUser = false;
    var node = tree.getNodeByParam('false'=='true'?'value':'id',
        (isLoadUser?"u_":"") + selectCodes[i]);
    if("false" == "true"){
      try{tree.checkNode(node, true, false);}catch(e){}
      tree.selectNode(node, false);
    }else{
      tree.selectNode(node, true);
    }
  }
}
var lastValue = "", nodeList = [], key = $("#keyword");
key.bind("focus", focusKey).bind("blur", blurKey).bind("change cut input propertychange", searchNode);
key.bind("keydown", function (e){if(e.which == 13){searchNode();}});
function focusKey(e) {
  if (key.hasClass("empty")) {
    key.removeClass("empty");
  }
}
function blurKey(e) {
  if (key.get(0).value === "") {
    key.addClass("empty");
  }
  searchNode(e);
}
function searchNode() {
  var value = $.trim(key.get(0).value);
  var keyType = "name";
  if (lastValue === value) {
    return;
  }
  lastValue = value;
  var nodes = tree.getNodes();
  if (value == "") {
    showAllNode(nodes);
    return;
  }
  hideAllNode(nodes);
  nodeList = tree.getNodesByParamFuzzy(keyType, value);
  updateNodes(nodeList);
}
function hideAllNode(nodes){      
  nodes = tree.transformToArray(nodes);
  for(var i=nodes.length-1; i>=0; i--) {
    tree.hideNode(nodes[i]);
  }
}
function showAllNode(nodes){      
  nodes = tree.transformToArray(nodes);
  for(var i=nodes.length-1; i>=0; i--) {
    if(nodes[i].getParentNode()!=null){
      tree.expandNode(nodes[i],false,false,false,false);
    }else{
      tree.expandNode(nodes[i],true,true,false,false);
    }
    tree.showNode(nodes[i]);
    showAllNode(nodes[i].children);
  }
}
function updateNodes(nodeList) {
  tree.showNodes(nodeList);
  for(var i=0, l=nodeList.length; i<l; i++) {
    var treeNode = nodeList[i];
    showChildren(treeNode);
    showParent(treeNode)
  }
}
function showChildren(treeNode){
  if (treeNode.isParent){
    for(var idx in treeNode.children){
      var node = treeNode.children[idx];
      tree.showNode(node);
      showChildren(node);
    }
  }
}
function showParent(treeNode){
  var parentNode;
  while((parentNode = treeNode.getParentNode()) != null){
    tree.showNode(parentNode);
    tree.expandNode(parentNode, true, false, false);
    treeNode = parentNode;
  }
}
function search($this) {
  $('#search').slideToggle(200);
  $('#btnShow').toggle();
  $('#btnHide').toggle();
  $('#keyword').focus();
}
</script>